CKEDITOR.plugins.add( 'variableselect',
    {
        init : function( editor )
        {

            var local = {
                "en": {
                    "viewButtonLabel": 'View image',
                    "addButtonLabel": 'Add image',
                    "insertVariableLabel": 'Variables'
                },
                "ru": {
                    "viewButtonLabel": 'Загруженные изображения',
                    "addButtonLabel": 'Добавить изображение',
                    "insertVariableLabel": 'Переменные'
                }
            };

            /*
             *  view down load files
             */
            editor.addCommand( 'viewImage', new CKEDITOR.dialogCommand( 'viewImage' ) );
            // create button
            editor.ui.addButton( 'viewImage',
            {
                label :   local[editor.config.language].viewButtonLabel,
                icon : this.path + 'images/view.png',
                command : 'viewImage'
            } );
            // add dialog
            CKEDITOR.dialog.add( 'viewImage', this.path + 'dialogs/view.js' );


            /*
             *  upload file
             */
            // add command
            editor.addCommand( 'addImage', new CKEDITOR.dialogCommand( 'addImage' ) );
            // create button
            editor.ui.addButton( 'addImage',
            {
                label :  local[editor.config.language].addButtonLabel,
                icon : this.path + 'images/plus.png',
                command : 'addImage'
            } );
            // add dialog
            CKEDITOR.dialog.add( 'addImage', this.path + 'dialogs/upload.js' );

            /*
             *  build select variables
             */
            var config = editor.config;

            editor.ui.addRichCombo( 'varSelect',
            {
                label : local[editor.config.language].insertVariableLabel,
                title : 'variable',
                multiSelect : false,
                minWidth: 250,

                panel :
                {
                    css : [ CKEDITOR.getUrl( editor.skinPath + 'editor.css' ) ].concat( config.contentsCss )
                },

                init : function()
                {
                    var variable,
                    variableOptions = this.getVariables();

                    this.startGroup( 'variables' );
                    this.add( '', '', '');
                    for ( var i = 0 ; i < variableOptions.length ; i++ )
                    {
                        this.add( variableOptions[ i ], variableOptions[ i ], variableOptions[ i ]);
                    }

                // Default value on first click
                // this.setValue('asd', "asd");
                },
                onClick : function(value)
                {
                    if(value)
                        editor.insertHtml( ' {{' + value + '}} ' );
                },
                getVariables: function (){
                    var temp =   $('#variables_ab').html();
                    var variables = [];
                    if (temp){
                        variables = temp.split('|');
                    }
                    return variables;

                }
            });


        }
    } );